<template>
	<div :class="'dis-inline '+(value==name&&name?'checked':'') " @click="check">
		<div class="dis-inline radio-out t-c ver-mid">
			<div class="radio-inner"></div>
		</div>
		<div class="dis-inline ft-24 ver-mid ml-18">{{label}}</div>
	</div>
</template>
<script>
	export default{
		props:{
			value:{},
			name:{},
			label:{
				type:String,
				default:""
			}
		},
		methods:{
			check(){
				if (this.value!=this.name) {
					this.$emit('input',this.name);
				}else{
					this.$emit('input',"");
				}
			}
		}
	}
</script>
<style scope>
	.checked .radio-out{border: 1px solid #FD4658;}
	.radio-out{width:32px;height:32px;border-radius:50%;border: 1px solid #DDDDDD;overflow: auto;}

	.checked .radio-inner{width: 16px;height: 16px;margin: 8px auto 0;border-radius: 50%;background:#FD4658; }
	.ml-18{margin-left: 18px;}
</style>